<!DOCTYPE html>
<html lang="zh-CN">

<head>
	<#include file="/include.html" />
	<title>WebMVC</title>
</head>

<body style="background-color: #F2F2F2">


	<form class="layui-form">
				<div class="layui-form-item">
						
						<div class="layui-upload">
							<button type="button" class="layui-btn" id="test1">上传图片</button>
							<div class="layui-upload-list">
								<img class="layui-upload-img" id="demo1">
								<p id="demoText"></p>
							</div>
						</div>
					</div>	

	</form>
	<script>
		
layui.use(['form','upload'], function() {
	var form=layui.form;
	var upload = layui.upload;
	var uploadInst = upload.render({
		elem: '#test1'
		,url: 'upimage'
		,before: function(obj){
		  //预读本地文件示例，不支持ie8
		  obj.preview(function(index, file, result){
			$('#demo1').attr('src', result); //图片链接（base64）
		  });
		}
		,done: function(res){
		  //如果上传失败
		  if(res.code != 0){
			return layer.msg('上传失败');
		  }else{
			return layer.msg(res.message);
		  }
		  //上传成功
		}
		,error: function(){
		  //演示失败状态，并实现重传
		  var demoText = $('#demoText');
		  demoText.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-xs demo-reload">重试</a>');
		  demoText.find('.demo-reload').on('click', function(){
			uploadInst.upload();
		  });
		}
	  });	
	  form.render();
});
	</script>
</body>


</html>